<div id="system" (contextmenu)="goBack($event)" (keydown)="getKey($event)" tabindex="1" (focus)="getFocus()">
  <header id="content-header">
    <!-- 时间 -->
    <div class="header-times">
      <p>{{ dateTimes[0] }}</p>
      <p>{{ dateTimes[1] }}</p>
      <p>{{ dateTimes[2] }}</p>
      <p>{{ dateTimes[3] }}</p>
      <p>年</p>
      <p>{{ dateTimes[4] }}</p>
      <p>{{ dateTimes[5] }}</p>
      <p>月</p>
      <p>{{ dateTimes[6] }}</p>
      <p>{{ dateTimes[7] }}</p>
      <p>日</p>
      <p> - </p>
      <p>{{ dateMonths[0] }}</p>
      <p>{{ dateMonths[1] }}</p>
      <p>时</p>
      <p>{{ dateMonths[2] }}</p>
      <p>{{ dateMonths[3] }}</p>
      <p>分</p>
      <p>{{ dateMonths[4] }}</p>
      <p>{{ dateMonths[5] }}</p>
      <p>秒</p>
    </div>
    <!-- 图标、数据 -->
    <div class="header-icon">
      <div class="margin-l" (click)="getKey($event, 1)">
        <img [class.logo]="logoTitle" [src]="companyLogo"/>
      </div>
      <div class="header-nav margin-l" *ngFor="let head of headList">
        <div class="header-top" *ngFor="let i of head.titleData">
          <p>{{ i.lable }}</p>
          <b>{{ titleData[i['feild']] }}</b>
        </div>
      </div>
    </div>
  </header>
  <div id="content-box">
    <div id="flexCon">
      <div class="flex-row">
        <div class="flex-cell flex-cell-l" *ngFor="let report of reportList"
             [ngStyle]="{flex: report.flex,marginLeft: report.margin, background: 'url('+ report.background +') 0 0 / 100% 100% no-repeat' }">
          <div class="chart-wrapper">
            <div class="chart-table">
              <apes-door-control-table [parmas]="report" [companyId]="companyData"></apes-door-control-table>
            </div>
          </div>
        </div>
      </div>

      <div class="flex-row flex-cell-b margin-t">
        <div class="flex-cell flex-cell-r">
          <div class="chart-wrapper">
            <div class="vertical">
              <div class="title-table">
                <div class="chart-table" *ngFor="let data of tablesLeftList" [ngStyle]="{width: data.titleWidth }">
                  <apes-door-control-table [parmas]="data" [companyId]="companyData"></apes-door-control-table>
                </div>
              </div>
              <div class="chart-table" *ngFor="let data of rightTableTop" [ngStyle]="{width: data.titleWidth }">
                <apes-door-control-table [parmas]="data" [companyId]="companyData"></apes-door-control-table>
              </div>
            </div>
          </div>
        </div>

        <div class="flex-cell flex-cell-b">
          <div class="chart-wrapper">
            <div class="vertical">
              <!-- 柱形图 -->
              <div class="tab-three-bar">
                <div class="bar-nav">
                  <div class="nav-left">
                    <p class="nav-one">待跟踪</p>
                    <p class="nav-two"></p>
                    <p class="nav-the"></p>
                  </div>
                  <div class="nav-right">
                    <div>
                      <p>跟踪人</p>
                      <span *ngFor="let headName of reportData">{{ headName.employee_name }}</span>
                    </div>
                    <div class="right-back">
                      <p>今日待跟踪</p>
                      <span class="span-one" *ngFor="let one of reportData">{{ one.today_total }}</span>
                    </div>
                    <div class="right-back">
                      <p>今日已跟踪</p>
                      <span class="span-two" *ngFor="let two of reportData">{{ two.grand_total }}</span>
                    </div>
                  </div>
                </div>
                <div id="container"></div>
              </div>
              <div class="title-table table-background">
                <div class="chart-table" *ngFor="let data of tablesRightList" [ngStyle]="{width: data.titleWidth}">
                  <apes-door-control-table class="pt" [parmas]="data" [companyId]="companyData"></apes-door-control-table>
                </div>
              </div>

            </div>
          </div>
        </div>
      </div>
    </div>

    <!--<div class="main-copy">-->
      <!--Copyright-->
      <!--<i class="anticon anticon-copyright"></i>-->
      <!--{{year}} 本系统由猿猿软件提供技术支持-->
    <!--</div>-->
  </div>
  <company-modal (paramsOut)="changeCompany($event)"></company-modal>
</div>


